<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">
<style type="text/css">
	body{
		margin: 0;
		padding: 0;
		background-color: #eeeeee;
		font-family: "楷体";
	}
	.item{
		margin: 20px;
		margin-bottom: 50px;
	}
	.imte_top{
		text-align: center;
	}
	.imte_top>span{
		font-size:14px;
		display: inline-block;
		padding: 5px 12px;
		background-color: #ddd;
		color:#fff;
		border-radius: 5px;
	}
	.item_content{
		background-color: #fff;
		padding: 25px 15px;
		margin-top: 6px;
	}
	.item_content_top_1{
		font-size: 24px;
		font-weight: bold;
	}
	.item_content_top_2{
		color:#eee;
		font-size: 14px;
		margin: 5px 0px;
	}
	.item_content_top_3{
		margin: 10px 0px;
	}
	.item_content_top_4{
		margin: 10px 0px;
	}
	.item_content_bottom>a{
		text-decoration: none;
		color:#33e;
	}
</style>
</head>
<body>
	<!--待取件的通知消息-->
	<div class="content" id="status0Content">
		<!--
			<div class="item">
			<div class="imte_top"><span>2019-10-12 12:00</span></div>
			<div class="item_content">
				<div class="item_content_top">
					<div class="item_content_top_1">取件通知</div>
					<div class="item_content_top_2">2019-10-12 12:00</div>
					<div class="item_content_top_3">您有一个包裹到e栈了!</div>
					<div class="item_content_top_4">
						取件码:<span style="color:#05a">123123</span><br>
						快递公司:顺丰快递<br>
						运单号码:123123123213<br>
						站点电话:13843838438<br>
						取件地址:学校快件集散中心<br>
					</div>
				</div>
				<hr>
				<div class="item_content_bottom">
					<a href="personQRcode.jsp?code=<%=e.getCode()%>">二维码</a>
				</div>
			</div>
		</div>
		-->

	</div>

	<!--已取件的通知消息-->
	<div class="content" id="status1Content">
		<!--
			<div class="item">
			<div class="imte_top"><span>2019-10-12 12:00</span></div>
			<div class="item_content">
				<div class="item_content_top">
					<div class="item_content_top_1">取件成功通知</div>
					<div class="item_content_top_2">2019-10-12 12:00</div>
					<div class="item_content_top_3">您有一个包裹从e栈取出了!</div>
					<div class="item_content_top_4">
						快递公司:顺丰快递<br>
						运单号码:12313431123<br>
						站点电话:13843838438<br>
					</div>
				</div>
				<hr>
				<div class="item_content_bottom">
					<a href="#">有疑问 ? 点了也没用</a>
				</div>
			</div>
		</div>
		-->
	</div>
	<script src="js/jquery.min.js"></script>
	<script src="layer/layer.js"></script>
	<!--js脚本-->
	<script>
		//jq入口函数
		$(function (){
			//发送ajax请求,通过手机号查询快递，用户登录时已经将手机号存入用户，将用户存入session
			$.getJSON("/wx/findExpressByUserPhone.do",null,function (data) {
				//data消息对象，data中的data是map，map中存在两个键值对status0和status1，每一个键值对对应一个数组分别存放已取件和未取件
				//data:{"status0":[{"id":117,"number":"1001","username":"陈伯维","userPhone":"18751902567","company":"顺丰速运","code":"301448","inTime":"2021-04-13 23:10:11","outTime":"未出库","status":"待取件","sysPhone":"18888888888"}]
				var data0=data.data.status0; //待取件的数组
				for (i=0;i<data0.length;i++){ //遍历数组，动态生成快递记录
					var item="<div class=\"item\">\n" +
							"\t\t\t<div class=\"imte_top\"><span>"+data0[i].inTime+"</span></div>\n" +
							"\t\t\t<div class=\"item_content\">\n" +
							"\t\t\t\t<div class=\"item_content_top\">\n" +
							"\t\t\t\t\t<div class=\"item_content_top_1\">取件通知</div>\n" +
							"\t\t\t\t\t<div class=\"item_content_top_2\">"+data0[i].inTime+"</div>\n" +
							"\t\t\t\t\t<div class=\"item_content_top_3\">您有一个包裹到e栈了!</div>\n" +
							"\t\t\t\t\t<div class=\"item_content_top_4\">\n" +
							"\t\t\t\t\t\t取件码:<span style=\"color:#05a\">"+data0[i].code+"</span><br>\n" +
							"\t\t\t\t\t\t快递公司:"+data0[i].company+"<br>\n" +
							"\t\t\t\t\t\t运单号码:"+data0[i].number+"<br>\n" +
							"\t\t\t\t\t\t站点电话:"+data0[i].sysPhone+"<br>\n" +
							"\t\t\t\t\t</div>\n" +
							"\t\t\t\t</div>\n" +
							"\t\t\t\t<hr>\n" +
							"\t\t\t\t<div class=\"item_content_bottom\">\n" +
							"\t\t\t\t\t<a href=\"/wx/createQRCode.do?type=express&code="+data0[i].code+"\">二维码</a>\n" +
							"\t\t\t\t</div>\n" +
							"\t\t\t</div>\n" +
							"\t\t</div>";
					$("#status0Content").append($(item));//向div中追加快递
				}

				var data1=data.data.status1; //已取件的数组
				for (i=0;i<data1.length;i++){ //遍历数组，动态生成快递记录
					var item="<div class=\"item\">\n" +
							"\t\t\t<div class=\"imte_top\"><span>"+data1[i].outTime+"</span></div>\n" +
							"\t\t\t<div class=\"item_content\">\n" +
							"\t\t\t\t<div class=\"item_content_top\">\n" +
							"\t\t\t\t\t<div class=\"item_content_top_1\">取件成功通知</div>\n" +
							"\t\t\t\t\t<div class=\"item_content_top_2\">"+data1[i].outTime+"</div>\n" +
							"\t\t\t\t\t<div class=\"item_content_top_3\">您有一个包裹从e栈取出了!</div>\n" +
							"\t\t\t\t\t<div class=\"item_content_top_4\">\n" +
							"\t\t\t\t\t\t快递公司:顺丰快递<br>\n" +
							"\t\t\t\t\t\t运单号码:"+data1[i].number+"<br>\n" +
							"\t\t\t\t\t\t站点电话:"+data1[i].sysPhone+"<br>\n" +
							"\t\t\t\t\t</div>\n" +
							"\t\t\t\t</div>\n" +
							"\t\t\t\t<hr>\n" +
							"\t\t\t\t<div class=\"item_content_bottom\">\n" +
							"\t\t\t\t\t<a href=\"#\">有疑问 ? 点了也没用</a>\n" +
							"\t\t\t\t</div>\n" +
							"\t\t\t</div>\n" +
							"\t\t</div>";
					$("#status1Content").append($(item));//向div中追加快递
				}
			});
		});
	</script>
</body>
</html>